<template>
    <div>
        <Row>
            <Col span="2">
                博客标题：
            </Col>
            <Col span="22">
                <Input v-model="blogName" placeholder="博客标题"/>
            </Col>
        </Row>
        <Row>
            <Col span="2">
                博客域名：
            </Col>
            <Col span="22">
                <Input v-model="realmName" placeholder="域名地址"/>
            </Col>
        </Row>
        <Row>
            <Col span="2">
                博客Logo：
            </Col>
            <Col span="22">
                <img :src="blogLogo" width="126px" height="126px">
                <Upload :action="uploadPath" :on-success="onSuccess" :show-upload-list="false">
                    <Button icon="ios-cloud-upload-outline">上传Logo</Button>
                </Upload>
            </Col>
        </Row>
        <Divider/>
        <Button type="primary">保存</Button>
    </div>
</template>

<script>
    export default {
        name: "UserManage",
        components: {},
        data() {
            return {
                blogName: "",
                realmName: "",
                blogLogo: "",
                uploadPath: this.apiBase + "/blog/file/upload"
            }
        },
        methods: {
            listConfig() {
                this.$http({
                    method: 'post',
                    url: this.apiBase + '/blog/config/list',
                    data: {}
                })
                    .then(response => {
                        this.blogName = response.data.data.configs.blogName.value
                        this.realmName = response.data.data.configs.realmName.value
                        this.blogLogo = this.apiBase + response.data.data.configs.blogLogo.value
                    })
                    .catch(error => {
                        console.log(error);
                    })
            },
            saveConfig() {
                this.$http({
                    method: 'post',
                    url: this.apiBase + '/blog/config/update',
                    data: {
                        "blogName": this.blogName,
                        "realmName": this.realmName,
                        "blogLogo": this.blogLogo
                    }
                })
                    .then(response => {

                    })
                    .catch(error => {
                        console.log(error);
                    })
            },
            onSuccess(response, file, fileList) {
                this.blogLogo = this.apiBase + response.data.fileManage.url
            }
        },
        created() {
            this.listConfig();
        }
    }
</script>

<style scoped>

</style>